<template>

	<div>
		<el-row>
			<el-col :span="24">
				<div class="grid-content bg-purple-dark">
					<el-table ref="multipleTable" :data="returnReg" tooltip-effect="dark" border style="width: 100%"
						@selection-change="handleSelectionChange">
						<el-table-column type="selection" width="55">
						</el-table-column>
						<el-table-column prop="name" label="药品名称" width="180">
						</el-table-column>
						<el-table-column prop="function" label="功能主治" width="180">
						</el-table-column>
						<el-table-column prop="composition" label="组成成分" width="180">
						</el-table-column>
						<el-table-column prop="usage" label="用法用量" width="180">
						</el-table-column>
						<el-table-column prop="matters" label="注意事项" width="280">
						</el-table-column>
						<el-table-column prop="taboo" label="禁忌" width="180">
						</el-table-column>
						<el-table-column prop="price" label="单价" >
						</el-table-column>
					</el-table>
				</div>
			</el-col>
		</el-row>
		<el-row>
			<div style="padding-top: 12px;">
				<el-col :span="24">
					<div class="grid-content bg-purple">
						<el-button type="primary" plain>药品选择完成</el-button>
					</div>
				</el-col>
			</div>
		</el-row>

	</div>
</template>

<script>
	export default {
		mounted: function() {
			this.$axios.get('http://localhost:8080/druginformation.json').then((result) => {
				this.returnReg = result.data; //写法固定
			}).catch((err) => {
				console.log(err);
			})
		},
		methods: {
			

		},
		data() {
			return {
				returnReg: [],
				radio: false,
				tableData: [{
					name: '复方鱼腥草片',
					function: '清热解毒、用于外感风热',
					composition: '鱼腥草，黄芩，板蓝根',
					usage: '口服，一次4～6片，一日3次',
					matters: '忌烟酒、辛辣、鱼腥食物',
					taboo: '尚不明确',
					price: 35
				}, {
					name: '复方鱼腥草片',
					function: '清热解毒、用于外感风热',
					composition: '鱼腥草，黄芩，板蓝根',
					usage: '口服，一次4～6片，一日3次',
					matters: '忌烟酒、辛辣、鱼腥食物',
					taboo: '尚不明确',
					price: 35
				}, {
					name: '复方鱼腥草片',
					function: '清热解毒、用于外感风热',
					composition: '鱼腥草，黄芩，板蓝根',
					usage: '口服，一次4～6片，一日3次',
					matters: '忌烟酒、辛辣、鱼腥食物',
					taboo: '尚不明确',
					validity: '24个月',
					price: 35
				}, {
					name: '复方鱼腥草片',
					function: '清热解毒、用于外感风热',
					composition: '鱼腥草，黄芩，板蓝根',
					usage: '口服，一次4～6片，一日3次',
					matters: '忌烟酒、辛辣、鱼腥食物',
					taboo: '尚不明确',
					price: 35
				}, {
					name: '复方鱼腥草片',
					function: '清热解毒、用于外感风热',
					composition: '鱼腥草，黄芩，板蓝根',
					usage: '口服，一次4～6片，一日3次',
					matters: '忌烟酒、辛辣、鱼腥食物',
					taboo: '尚不明确',
					price: 35
				}]
			}
		},
	}
</script>
<style>
	.el-dropdown {
		vertical-align: top;
	}

	.el-dropdown+.el-dropdown {
		margin-left: 15px;
	}

	.el-icon-arrow-down {
		font-size: 12px;
	}
</style>
